<template>
  <div>
    <!-- 导航栏 -->
    <van-nav-bar title="我的收藏" left-arrow @click-left="onClickLeft" />
    <!-- 商品渲染 -->
    <Card :pocketList="pocketList"></Card>
    <!-- 加载更多 -->
    <Loading></Loading>
  </div>
</template>

<script>
import Card from "@/components/card.vue";
import Loading from "@/components/bottom_loading";
export default {
  name: "KuangjiaMyPocket",

  data() {
    return {
      pocketList: this.$store.state.list,
    };
  },
  components: {
    Card,
    Loading,
  },
  mounted() {},

  methods: {
    // 点击返回上一级
    onClickLeft() {
      this.$router.back(-1);
    },
  },
};
</script>

<style lang="less" scoped>
// 导航栏
.van-nav-bar {
  background-color: #f9f9f9;
  // 标题颜色
  /deep/ .van-nav-bar__title {
    color: #a3998d;
  }
  // 左箭头颜色
  /deep/.van-icon {
    color: #67d0bb;
  }
}

// 卡片背景颜色
.van-card {
  background-color: #fff;
}
// 找相似按钮
.btn {
  border-radius: 10px;
  color: #bebebe;
  border-color: #bebebe;
  height: 30px;
}

// 卡片价格颜色
.van-card__price {
  color: #e7637a;
}
.van-card__desc {
  color: #dfdfdf;
  line-height: 30px;
}
.van-card__title {
  line-height: 25px;
}
</style>